//画棋盘
/** @type {HTMLCanvasElement} */
var mapcanv = document.getElementById("map");
var ctx = mapcanv.getContext("2d");

//棋子信息
var chessinfo = [
  { name: "黑子", color: "black", chessList: [] },
  { name: "白子", color: "white", chessList: [] },
];
var chessrec = [];
var chess = 0;
var winStatus = true;

// 棋盘
function init() {
  //ctx.fillStyle = '#FF8B4513';
  //ctx.fillRect(0, 0, mapcanv.width, mapcanv.height);
  mapcanv.width = 800;
  mapcanv.height = 800;
  for (let i = 1; i < 16; i++) {
    // 画竖线
    ctx.beginPath();
    ctx.moveTo(50 * i, 50);
    ctx.lineTo(50 * i, 750);
    ctx.stroke();
    // 画横线
    ctx.beginPath();
    ctx.moveTo(50, 50 * i);
    ctx.lineTo(750, 50 * i);
    ctx.stroke();
  }
}

init();

function restart() {
  chessrec = [];
  chessinfo[0].chessList = [];
  chessinfo[1].chessList = [];
  chess = 0;
  winStatus = true;
  init();
}

//画棋子
function setChess(x, y, c) {
  ctx.save();
  ctx.beginPath();
  ctx.fillStyle = c;
  ctx.arc(x, y, 25, 0, 2 * Math.PI);
  ctx.fill();
  ctx.restore();
}

// 悔棋
function backChess() {
  init();
  //chess ^= 1
  chessinfo[chess ^ 1].chessList.pop();
  chessrec.pop();
  for (let i = 0; i < chessrec.length; i++) {
    // console.log(chessrec[i]);
    let x = String(chessrec[i]).split("-")[0];
    let y = String(chessrec[i]).split("-")[1];
    //console.log(x,y)
    setChess(parseInt(x) * 50, parseInt(y) * 50, chessinfo[i % 2].color);
    //chess ^= 1
  }
  //chess ^= 1
}

//   判断输赢
function isWin(x, y) {
  // 判断竖着
  if (chessinfo[chess].chessList.length >= 5 && (y - 4 > 0 || y + 4 < 16)) {
    let c = 1;
    for (let i = 1; i <= 4; i++) {
      if (
        y + i < 16 &&
        chessinfo[chess].chessList.includes(x + "-" + (y + i))
      ) {
        c++;
      } else {
        break;
      }
    }
    for (let i = 1; i <= 4; i++) {
      if (y - i > 0 && chessinfo[chess].chessList.includes(x + "-" + (y - i))) {
        c++;
      } else {
        break;
      }
    }
    if (c == 5) {
      winMsg();
    }
  }
  // 判断横着
  if (chessinfo[chess].chessList.length >= 5 && (x - 4 > 0 || x + 4 < 16)) {
    let c = 1;
    for (let i = 1; i <= 4; i++) {
      if (x + i < 16 && chessinfo[chess].chessList.includes(i + x + "-" + y)) {
        c++;
      } else {
        c = 1;
      }
    }
    for (let i = 1; i <= 4; i++) {
      if (x - i > 0 && chessinfo[chess].chessList.includes(x - i + "-" + i)) {
        c++;
      } else {
        break;
      }
    }
    if (c == 5) {
      winMsg();
    }
  }
  // 右斜判断
  if (
    chessinfo[chess].chessList.length >= 5 &&
    (y - 4 > 0 || y + 4 < 16) &&
    (x - 4 > 0 || x + 4 < 16)
  ) {
    let c = 1;
    for (let i = 1; i <= 4; i++) {
      if (
        x + i < 16 &&
        y + i < 16 &&
        chessinfo[chess].chessList.includes(x + i + "-" + (y + i))
      ) {
        c++;
      } else {
        break;
      }
    }
    for (let i = 1; i <= 4; i++) {
      if (
        x - i > 0 &&
        y - i > 0 &&
        chessinfo[chess].chessList.includes(x - i + "-" + (y - i))
      ) {
        c++;
      } else {
        break;
      }
    }
    //   console.log(c);
    if (c == 5) {
      winMsg();
    }
  }
  // 左斜判断
  if (
    chessinfo[chess].chessList.length >= 5 &&
    (y - 4 > 0 || y + 4 < 16) &&
    (x - 4 > 0 || x + 4 < 16)
  ) {
    let c = 1;
    for (let i = 1; i <= 4; i++) {
      if (
        x - i > 0 &&
        y + i < 16 &&
        chessinfo[chess].chessList.includes(x - i + "-" + (y + i))
      ) {
        c++;
      } else {
        break;
      }
    }
    for (let i = 1; i <= 4; i++) {
      if (
        x + i < 16 &&
        y - i > 0 &&
        chessinfo[chess].chessList.includes(x + i + "-" + (y - i))
      ) {
        c++;
      } else {
        break;
      }
    }
    //   console.log(c);
    if (c == 5) {
      winMsg();
    }
  }
}

function winMsg() {
  alert(chessinfo[chess].name + "win!");
  winStatus = false;
  // 只执行一次
  setTimeout(function () {
    change(chessinfo[chess ^ 1].name + "win!");
  }, 2000);
}

//点击事件监听
mapcanv.addEventListener("click", function (ev) {
  // console.log(ev);
  let x = Math.round(ev.offsetX / 50);
  let y = Math.round(ev.offsetY / 50);
  //console.log("x=" + x, "y=" + y);
  let pos = x + "-" + y;
  if (x * y > 0 && x < 16 && y < 16 && !chessrec.includes(pos) && winStatus) {
    setChess(x * 50, y * 50, chessinfo[chess].color);
    chessinfo[chess].chessList.push(pos);

    chessrec.push(pos);

    //   console.log(chessrec);
    //   判断是否赢了
    isWin(x, y);
    // 更改玩家
    chess ^= 1;
    change(chessinfo[chess].name);
  }
});

// 更换棋子
function change(c) {
  //console.log(111)
  document.getElementById("who").innerText = c;
}

// 悔棋
document.getElementById("back").addEventListener("click", function (ev) {
  if (winStatus) {
    chess ^= 1;
    change(chessinfo[chess].name);
    backChess();
  } else {
    alert("本局已结束，请重新开始！");
  }
});
